<template>
	<div>
		<el-tabs v-model="activeName2" type="card" @tab-click="handleClick">
			<el-tab-pane label="系统录入" name="first">
				<el-form :inline="true" ref="form" :model="pageAbout" style="margin-left:10px">
					<el-form-item label="姓名" prop="personal_name">
						<el-input placeholder="姓名" v-model="pageAbout.personal_name"></el-input>
					</el-form-item>
					<el-form-item label="电话" prop="personal_mobile">
						<el-input placeholder="电话" v-model="pageAbout.personal_mobile"></el-input>
					</el-form-item>
					<el-form-item label="客户经理" prop="personal_belong">
						<el-select v-model="pageAbout.personal_belong" placeholder="请选择" >
							<el-option v-for="item in initDatakh" :label="item.realName" :value="item.realName" :key="item.id">
							</el-option>
						</el-select>
					</el-form-item>
				</el-form>
				<el-form :inline="true" style="margin-left:10px">
					<el-form-item>
						<el-button type="primary" @click="resetForm('form')">重置</el-button>
					</el-form-item>
					<el-form-item>
						<el-button type="primary" @click="found">查找</el-button>
					</el-form-item>
					<el-form-item>
						<el-button type="primary" @click="addPer('addPerson')" v-if="limit.limitId101.status==1">新增</el-button>
					</el-form-item>
				</el-form>
				<div>
					<div class="dateMsg" v-if="pageCount" style="color: red;margin-left:10px">总计<b>{{pageCount}}</b>条数据</div>
					<!--<el-table :data="tableData" style="width: 100%" v-loading="listLoading">-->
					<el-table :data="tableData"  style="width: 100%;margin-left:10px"  v-loading="listLoading">
						<el-table-column prop="personal_name"  label="姓名" :formatter="banFormatLength">
						</el-table-column>
						<el-table-column prop="personal_mobile" label="电话">
						</el-table-column>
						<el-table-column prop="enterprise_name"  label="任职单位" >
						</el-table-column>
						<el-table-column prop="personal_duty" label="职位">
						</el-table-column>
						<el-table-column prop="personal_belong"  label="客户经理">
						</el-table-column>
						<el-table-column prop="personal_flag"  label="启用/禁用" :formatter="banFormat">
						</el-table-column>
						<el-table-column prop="actions"   label="操作">
							<template scope="scope">
								<!--<el-button  type="text" size="small" @click="lookOver(scope.row.personal_id,'checkDiolage')">查看</el-button>-->
								<el-button type="text"  size="small" @click="editMan(scope.row.personal_id,'editDiolage')" v-if="limit.limitId98.status==1">编辑</el-button>
								<el-button type="text" size="small"  @click="showChange('changeUserDialog',scope.row.personal_id)" v-if="limit.limitId100.status==1">变更客户经理</el-button>
								<el-button v-if="scope.row.personal_flag==1" type="text" size="small" @click="forBidden(scope.row.personal_id,2)">启用</el-button>
								<el-button v-else type="text" size="small" @click="forBidden(scope.row.personal_id,1)">禁用</el-button>
							</template>
						</el-table-column>
					</el-table>
				</div>
				<div class="pagination" style="width:200px;margin-top:10px;margin-left:75% ">
					<el-pagination @current-change="getCurrentpage"
								   :page-size="10"
								   layout="prev, pager, next"
								   :total="pageCount">
					</el-pagination>
				</div>
			</el-tab-pane>
			<el-tab-pane label="用户注册" name="second">
				<el-form :inline="true" ref="form" :model="pageAbout" style="margin-left:10px">
					<el-form-item label="姓名" prop="personal_name">
						<el-input placeholder="姓名" v-model="pageAbout.personal_name"></el-input>
					</el-form-item>
					<el-form-item label="电话" prop="personal_mobile">
						<el-input placeholder="电话" v-model="pageAbout.personal_mobile"></el-input>
					</el-form-item>
					<el-form-item label="客户经理" prop="personal_belong">
						<el-select v-model="pageAbout.personal_belong" placeholder="请选择" >
							<el-option v-for="item in initDatakh" :label="item.realName" :value="item.realName" :key="item.id">
							</el-option>
						</el-select>
					</el-form-item>
				</el-form>
				<el-form :inline="true" style="margin-left:10px">
					<el-form-item>
						<el-button type="primary" @click="resetForm('form')">重置</el-button>
					</el-form-item>
					<el-form-item>
						<el-button type="primary" @click="found">查找</el-button>
					</el-form-item>
					<!--<el-form-item>-->
						<!--<el-button type="primary" @click="addPer('addPerson')" v-if="limit.limitId101.status==1">新增</el-button>-->
					<!--</el-form-item>-->
				</el-form>
				<div>
					<div class="dateMsg" v-if="pageCount" style="color: red;margin-left:10px">总计<b>{{pageCount}}</b>条数据</div>
					<!--<el-table :data="tableData" style="width: 100%" v-loading="listLoading">-->
					<el-table :data="tableData"  style="width: 100%;margin-left:10px"  v-loading="listLoading">
						<el-table-column prop="personal_name"  label="姓名" :formatter="banFormatLength">
						</el-table-column>
						<el-table-column prop="personal_mobile" label="电话">
						</el-table-column>
						<el-table-column prop="enterprise_name"  label="任职单位" >
						</el-table-column>
						<el-table-column prop="personal_duty" label="职位">
						</el-table-column>
						<el-table-column prop="personal_belong"  label="客户经理">
						</el-table-column>
						<el-table-column prop="personal_flag"  label="启用/禁用" :formatter="banFormat">
						</el-table-column>
						<el-table-column prop="actions"   label="操作">
							<template scope="scope">
								<!--<el-button  type="text" size="small" @click="lookOver(scope.row.personal_id,'checkDiolage')">查看</el-button>-->
								<el-button type="text"  size="small" @click="editMan(scope.row.personal_id,'editDiolage')" v-if="limit.limitId98.status==1">编辑</el-button>
								<el-button type="text" size="small"  @click="showChange('changeUserDialog',scope.row.personal_id)" v-if="limit.limitId100.status==1">变更客户经理</el-button>
								<el-button v-if="scope.row.personal_flag==1" type="text" size="small" @click="forBidden(scope.row.personal_id,2)">启用</el-button>
								<el-button v-else type="text" size="small" @click="forBidden(scope.row.personal_id,1)">禁用</el-button>
							</template>
						</el-table-column>
					</el-table>
				</div>
				<div class="pagination" style="width:200px;margin-top:10px;margin-left:75% ">
					<el-pagination @current-change="getCurrentpage"
								   :page-size="10"
								   layout="prev, pager, next"
								   :total="pageCount">
					</el-pagination>
				</div>
			</el-tab-pane>
		</el-tabs>

		<!-- 变更负责人 -->
				<el-dialog title="变更客户经理" :visible.sync="dialog.changeUserDialog.open" size="tiny" v-if="dialog.changeUserDialog.open">
					<el-form>
						<el-form-item label="选择客户经理">
											<el-select v-model="changeManage" placeholder="请选择客户经理">
													<el-option v-for="item in initData" :label="item.realName" :value="item.realName" :key="item.id">
													</el-option>
											</el-select>
									</el-form-item>
									<el-form-item>
											<div style="text-align:center">
													<el-button type="primary" @click="closeDialog('changeUserDialog')">取消</el-button>
													<el-button type="primary" @click="changManager('changeUserDialog')">提交</el-button>
											</div>
									</el-form-item>

								</el-form>
						</el-dialog>
		<!--添加个人-->
		<el-dialog title="添加个人" :visible.sync="dialog.addPerson.open" size="small" v-if="dialog.addPerson.open">
						<addMan></addMan>
		</el-dialog>
		<!--审核个人-->
		<el-dialog title="查看" :visible.sync="dialog.checkDiolage.open" :modal="false" size="small" v-if="dialog.checkDiolage.open">
			<personCheck></personCheck>
		</el-dialog>
		<!--编辑个人-->
		<el-dialog title="编辑个人" :visible.sync="dialog.editDiolage.open" :modal="false" size="small" v-if="dialog.editDiolage.open">
			<personEdit></personEdit>
		</el-dialog>
	</div>
</template>
<script>
	import Bus from '@/config/bus.js'
	import _http from '@/components/common/http.vue'
	import _param from '@/components/common/param.vue'
	import personEdit from '@/components/cust/common/editMan.vue'
	import personCheck from '@/components/cust/common/lookMan.vue'
	import addMan from '@/components/cust/people/addPerson.vue'
export default{
	components:{addMan,personEdit,personCheck},
	data(){
		return{
			limit:'',
			apiPort:{
				changeStatus:'ctm/v1/changeFlag',
//				客户经理
				managerList:'ctm/v1/changeTobelong',
//				查询客户经理用户
				userList:"sysuser/v1/selectall",
//				王添航接口
				WangApi:"ctm/v1/list",
//				客户管理个人列表
				selfList:'MyProject/ctm/v1/list',

//
//                    企业类型接口
//				companytypeApi:'BASEURL/adminApi/dicTree?type=2',
////                    上市情况接口
//				inmarketApi:'BASEURL/adminApi/dicTree?type=3',
////                    涉及领域接口
//				involvedfieldApi:'BASEURL/adminApi/dicTree?type=5',
////                    客户经理字段接口
//				customerManager:''
			},
			value:'',
			initDatakh:'',
			options:[],
			activeName2: 'first',
			param:{
				params:{
					peopleName:'',
					cellphone:'',
					cusManageId:'',
					page:''
				}
			},
			dialog:{
				addCharDialog:{
					open:false
				},
				checkDiolage:{
					open:false
				},
				editDiolage:{
					open:false
				},
				changeUserDialog:{
					open:false
				},
				editCharDialog:{
					open:false
				},
				addPerson:{
					open:false
				}
			},
			dataList:{
				actionTableList:[],
				actionTableDataCount:0,
				selectActionList:[]
			},
			currentPage:1,
			pageCount:'',
			pageAbout:{
				personal_name:'',
				personal_mobile:'',
				personal_belong:'',
				pageNumber:1,
				pageSize:10,
				from_internet:''
			},
			listLoading:false,
//			存放变更后的经理
			changeManage:'',
			userid:'',
			form:{
				name:'',
				phoneNum:'',
				manager:'',
				changeUser:{
					user:''
				},
				search:{
					name:'',
					techRoute:'-1',
					user:''
				}
			},
			initData:[],
			tableData: [],
				// 获取row的key值
				 getRowKeys(row) {
						 return row.id;
				 },
				 //调试方法
				 echoSomething(row){
				 		console.log('....');
				 },
		}
	},
	methods:{
		handleClick(tab) {
			this.name = tab.name
			if(this.name=='first'){
				this.pageAbout.from_internet=''
				this.pageAbout.personal_name=''
				this.pageAbout.personal_mobile=''
				this.pageAbout.personal_belong=''

				this.getTotal()
			}else{
				this.pageAbout.from_internet=1
				this.pageAbout.personal_name=''
				this.pageAbout.personal_mobile=''
				this.pageAbout.personal_belong=''
				this.getTotal()
			}

		},
		banFormatLength:function(row,column){
			var ban = row[column.property];
			if ( ban==undefined){
				return "来自于互联网,未验证姓名";
			}
			return ban;
		},
		forBidden(id,par){
			var that = this
			var param = {personal_id:id,personal_flag:par,userid:that.userid}
			var params = that.querystring.stringify(param)
			_http.axiosRequest(that,that.apiPort.changeStatus,params,(res)=>{
				console.log(234567890)
			console.log(res.data)
			that.getCurrentpage(that.currentPage)
			that.closeDialog(param)
		})
		},
//		提交变更
		changManager(param){
			var that = this
			var par = {personal_id:this.changeManageid,personal_belong:this.changeManage,userid:that.userid}
			var params = that.querystring.stringify(par)
			_http.axiosRequest(that,that.apiPort.managerList,params,(res)=>{

			console.log(res.data)
			that.getCurrentpage(that.currentPage)
			that.closeDialog(param)
		})
		},
//		显示变更客户经理
//		showChange(param,id){
//			var that = this
//			this.openDialog(param)
//			_http.axiosRequest(that,that.apiPort.managerList,(res)=>{
//				alert(1)
//				console.log(234567890)
//			alert(res)
//			console.log(res)
//		})
//		},
//		查询用户列表获得变更客户经理的内容
		showChange(param,id){
			this.changeManageid=id
			var that = this
			this.openDialog(param)
			var param = {userid:that.userid}
			var params = that.querystring.stringify(param)
			_http.axiosRequest(that,that.apiPort.userList,params,(res)=>{
				console.log(res.data)
			that.initData = res.data
		})
		},
		getKh(){
			var that = this
			var param = {userid:that.userid}
			var params = that.querystring.stringify(param)
			_http.axiosRequest(that,that.apiPort.userList,params,(res)=>{
				console.log(res.data)
			that.initDatakh = res.data
		})
		},
		found(){
			this.currentPage=1
			this.getTotal()
		},
//		查看详情页函数
		lookOver(id,param){
			this.openDialog(param)
			setTimeout(function(){
				Bus.$emit('sendCode',id)
			},100)
		},
		editMan(id,param){
			this.openDialog(param)
			setTimeout(function(){
				Bus.$emit('sendEdit',id)
			},100)
		},
		lookFor(){
			var that = this
			_http.axiosGetparam(that,that.apiPort.selfList,that.param,(res)=>{

//				console.log(res)
		})
		},
		//		获取当前页码内容
		goToPage(val){
			_http.axiosRequest(this,'actionList',{pageNo:val,pageSize:10,type:'form'},(res)=>{
				this.dataList.actionTableList = res.data.dataList
			this.dataList.actionTableDataCount = res.data.dataCount
		})
		},
	//时间格式化
				dateFormat:function(row, column) {
						 var date = row[column.property];
						 if (date == undefined) {
					 			return "";
							}
							return moment(date).format("YYYY-MM-DD HH:mm:ss");
				},
	//【禁用状态】格式化
				banFormat:function(row,column){
					var ban = row[column.property];
					if ( ban == 1 ){
						return "禁用";
					}
					return "启用";
				},
				openDialog(dialog){
					this.dialog[dialog].open = true
				},

				closeDialog(dialog){
					this.dialog[dialog].open = false
				},
				dialogBtnOk(dialog){
					if (dialog == 'changeUserDialog'){
						this.closeDialog(dialog)
					}
				},
				resetForm(form){
					this.$refs[form].resetFields();
				},
				addPer(dialog){
					this.dialog[dialog].open = true
				},
//		getType(){
//			var that = this
////            获取接口
//			_http.axiosGet(that,that.apiPort.personage,(res)=>{
////			 console.log(res.data)
////			var a = res.data
////			console.log(a)
//		})
//			_http.axiosGet(that,that.apiPort.selfList,(res)=>{
//
//				console.log(res)
//			this.tableData=res.data.data
//			console.log(res.data.data)
//		})
//		},
//		跳转到指定页
		getCurrentpage(val){
			var that = this
			this.currentPage = val?val:1
			this.listLoading=true
			this.pageAbout.pageNumber=this.currentPage
			var params = that.querystring.stringify(this.pageAbout)
			_http.axiosRequest(that,that.apiPort.WangApi,params,(res)=>{
				that.pageCount=res.data.data.total
//				console.log(res)
			this.listLoading=false
			that.tableData = res.data.data.records
		})
		},
//		获取首页数据
		getTotal(){
			var that = this
			this.listLoading=true
			this.pageAbout.pageNumber=this.currentPage
			var params = that.querystring.stringify(this.pageAbout)
			_http.axiosRequest(that,that.apiPort.WangApi,params,(res)=>{
//				console.log(res)
				that.pageCount=res.data.data.total
				this.listLoading=false
				that.tableData = res.data.data.records
			})
		},
	},
	beforeDestroy(){
		Bus.$off("sendRef")
		Bus.$off("close")
	},
	mounted(){
		this.limit = JSON.parse(localStorage.getItem("limitList"))
		this.userid=localStorage.getItem('userId')
		this.pageAbout.userid = localStorage.getItem('userId')
		this.getTotal()
		this.getKh()
		var that=this
		Bus.$on('sendRef',function(val){
			if(val){
				that.getTotal()
				setTimeout(function(){
					that.closeDialog('editDiolage')
				},500)
			}
		})
		Bus.$on('close',function(val){
			if(val==1){

				setTimeout(function(){
					console.log(1234)
					that.closeDialog('addPerson')
				},500)
			}
		})
//		this.getUser()
		var limitList = JSON.parse(localStorage.getItem("limitList"))
		console.log(limitList.limit2)
	 }
}
</script>
